<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <title>$.htmlClean</title>
    <style type="text/css">
        html, body
        {
            background-color: #fcf9f3;
        }
        .input, .result
        {
            font-family: Monospace;
        }
        .success
        {
            color: #0c0;
        }
        .failure
        {
            color: #c00;
        }
    </style>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript" src="jquery.htmlClean.js"></script>
    <script type="text/javascript">
        function encode(value) {
            return value
                .replace(/\&/g, '&amp;')
                .replace(/\</g, '&lt;')
                .replace(/\>/g, '&gt;');

        }
        function clean(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean(input, options), expected)
        }
        function trim(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean.trim(input, options), expected)
        }
        function trimStart(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean.trimStart(input, options), expected)
        }
        function trimEnd(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean.trimEnd(input, options), expected)
        }
        function test_isEqual(actual, expected) {
            document.write("<p class='result ".concat(
                actual == expected ? "success" : "failure",
                "'>actual&nbsp;&nbsp;: '", encode(actual), "'<br />expected: '", encode(expected), "'</p>"));
        }
        function note(text) {
            document.write("<p><em>".concat(encode(text), "</em></p>"));
        }
    </script>
</head>
<body>
    <p>
        <a href="http://code.google.com/p/jquery-clean/">http://code.google.com/p/jquery-clean/</a></p>
    <h2>
        Clean</h2>
    <script type="text/javascript">
        note("reported: $.htmlClean('<p>Some text</p><div class=\"yt_holder\"><object style=\"display:block\" width=\"590\" height=\"332\"><param name=\"movie\" value=\"http://www.youtube.com/v/ADgCYjAtRUY\"><param name=\"allowFullScreen\" value=\"true\"><param name=\"allowscriptaccess\" value=\"always\"><param name=\"wmode\" value=\"opaque\"><embed src=\"http://www.youtube.com/v/ADgCYjAtRUY\" type=\"application/x-shockwave-flash\" width=\"590\" height=\"332\" allowscriptaccess=\"always\" allowfullscreen=\"true\" wmode=\"opaque\"></object></div><p>Anoteher text</p>', {allowedTags: [\"p\",\"em\",\"strong\",\"a\",\"ol\",\"ul\", \"li\",\"img\",\"object\",\"param\",\"embed\",\"div\"], allowedClasses: [\"yt_holder\"],	allowedAttributes: [[\"class\"],[\"class\", \"div\"],[[\"style\",\"width\",\"height\"], \"object\"],[[\"name\",\"value\"], \"param\"],[[\"src\",\"type\",\"width\",\"height\",\"allowscriptaccess\",\"allowfullscreen\",\"wmode\"], \"embed\"]], replaceStyles: [[/font-weight:\s*bold/i, \"strong\"], [/font-style:\s*italic/i, \"em\"]]});");
        clean(
            "<p>Some text</p><div class=\"yt_holder\"><object style=\"display:block\" width=\"590\" height=\"332\"><param name=\"movie\" value=\"http://www.youtube.com/v/ADgCYjAtRUY\"><param name=\"allowFullScreen\" value=\"true\"><param name=\"allowscriptaccess\" value=\"always\"><param name=\"wmode\" value=\"opaque\"><embed src=\"http://www.youtube.com/v/ADgCYjAtRUY\" type=\"application/x-shockwave-flash\" width=\"590\" height=\"332\" allowscriptaccess=\"always\" allowfullscreen=\"true\" wmode=\"opaque\"></object></div><p>Anoteher text</p>",
            "<p>Some text</p><div class=\"yt_holder\"><object><param name=\"movie\" value=\"http://www.youtube.com/v/ADgCYjAtRUY\" /><param name=\"allowFullScreen\" value=\"true\" /><param name=\"allowscriptaccess\" value=\"always\" /><param name=\"wmode\" value=\"opaque\" /><embed src=\"http://www.youtube.com/v/ADgCYjAtRUY\" type=\"application/x-shockwave-flash\" width=\"590\" height=\"332\" /></object></div><p>Anoteher text</p>",
            {
                format: false,
                allowedTags: ["p", "em", "strong", "a", "ol", "ul", "li", "img", "object", "param", "embed", "div"],
                allowedClasses: ["yt_holder"],
                allowedAttributes: [["class"], ["class", "div"], [["style", "width", "height"], "object"], [["name", "value"], "param"], [["src", "type", "width", "height", "allowscriptaccess", "allowfullscreen", "wmode"], "embed"]],
                replaceStyles: [[/font-weight:\s*bold/i, "strong"], [/font-style:\s*italic/i, "em"]]
            });

    </script>
</body>
</html>
